
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="iconfont.css">
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        .markdown {
            color: #666;
            font-size: 14px;
            line-height: 1.8;
        }
        .markdown > ul li, .markdown blockquote ul > li {
            margin-left: 20px;
            padding-left: 4px;
        }
        .icon_lists .icon {
            font-size: 28px;
            line-height: 40px;
            margin: 10px 0;
            color: #333;
            -webkit-transition: font-size 0.25s ease-out 0s;
            -moz-transition: font-size 0.25s ease-out 0s;
            transition: font-size 0.25s ease-out 0s;
        }
        .icon_lists li {
            float: left;
            width: 60px;
            height: 80px;
            text-align: center;
            list-style: none !important;
        }

    </style>
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
					<i class="icon iconfont icon-iconfontdizhi"></i>
                    <div class="name">发票</div>
                </li>
                <li>
                    <i class="icon iconfont icon-iconfonterweima"></i>
                    <div class="name">文件</div>
                </li>
                <li>
                    <i class="icon iconfont icon-iconfontfangdajing"></i>
                    <div class="name">合同</div>
                </li>
                <li>
                    <i class="icon iconfont icon-iconfontfenxiang"></i>
                    <div class="name">其他</div>
                </li>
        </ul>
    </div>
</body>
</html>
